<template>
	<view class="container">
		<view class="notice">
			<view class="notice-item" v-for="item in noticeList">
				<view class="notice-item-title">
					{{item.title}}
				</view>
				<view class="notice-item-description">
					{{item.description}}
				</view>
				<view class="notice-item-createTime">
					{{item.createTime}}
				</view>
			</view>
		</view>
		
		
	</view>
</template>

<script>
import { getNoticeList } from '../../api/notice'
	export default {
		data() {
			return {
				noticeList:[]
			}
		},
		methods: {
			
		},
		onLoad() {
			getNoticeList().then(res=>{
				this.noticeList=res.data.data
			})
		}
	}
</script>

<style>
.container{
	width: 100%;
}
.notice{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.notice-item{
	width: 80%;
	background-color: lightblue;
	margin: 2vh auto;
	padding: 2vh;
	border-radius: 2vh;	
	display: flex;
	flex-direction: column;
	height: 13vh;
}
.notice-item-title{
	flex: 0 0 4vh;
}
.notice-item-description{
	flex: 1;
	font-size: 4vh;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 1;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	
}
.notice-item-createTime{
	flex: 0 0 2vh;
}
</style>
